import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:flutter_html/flutter_html.dart';

import 'msg_detail_logic.dart';
import 'msg_detail_state.dart';

class MsgDetailPage extends StatelessWidget {
  const MsgDetailPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final MsgDetailLogic logic = Get.put(MsgDetailLogic());
    final MsgDetailState state = Get.find<MsgDetailLogic>().state;

    return Scaffold(
      appBar: AppBar(
        title: GetBuilder<MsgDetailLogic>(
          builder: (logic) => Text(state.title),
        ),
        leading: IconButton(
          icon: const Icon(Icons.arrow_back_ios),
          onPressed: () => Get.back(),
        ),
      ),
      body: GetBuilder<MsgDetailLogic>(
        builder: (logic) {
          // 显示加载对话框
          if (state.isLoading) {
            return _buildLoadingDialog(context, logic);
          }
          
          return SingleChildScrollView(
            padding: const EdgeInsets.all(16.0),
            child: Html(
              data: state.content,
              style: {
                "body": Style(
                  fontSize: FontSize(16.0),
                  lineHeight: LineHeight(1.5),
                ),
              },
            ),
          );
        },
      ),
    );
  }

  Widget _buildLoadingDialog(BuildContext context, MsgDetailLogic logic) {
    return Center(
      child: Container(
        padding: const EdgeInsets.all(20),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(8),
          boxShadow: [
            BoxShadow(
              color: Colors.black.withOpacity(0.1),
              blurRadius: 10,
              offset: const Offset(0, 5),
            ),
          ],
        ),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            const CircularProgressIndicator(),
            const SizedBox(height: 20),
            const Text('正在加载...'),
            const SizedBox(height: 16),
            TextButton(
              onPressed: () => logic.cancelLoading(),
              child: const Text('取消'),
            ),
          ],
        ),
      ),
    );
  }
}
